/**
 * @description  VaR 分析
 * @author shenhong
 */
import React, { PureComponent } from 'react';
import { Row, Col, message } from 'antd';
import { DATA_ENTRY, NoQueryC, AdvancedSearch, ContentPackage } from '@/src/comps';
import moment from 'moment';
import style from './index.less';
import GainsAndLosses from './gainsAndLosses'; // 损益分布
import ResultCharts from './resultCharts'; // 结果图
import Detailed from './detailed'; // 明细表

class LiquidityRisk extends PureComponent {
  constructor() {
    super();
    this.state = {
      portfolioCode: undefined,
      isShow: false,
      formData: {},
      childrenMsg: '--',
    };
  }
  componentDidMount() {}

  // 查询
  searchData = (e) => {
    if (e.portfolio && e.endDate && e.confidenceLevel && e.horizonTime) {
      const data = {
        portfolioId: this.state.portfolioCode,
        endDate: e.endDate.format('YYYY-MM-DD'),
        confidenceLevel: Number(e.confidenceLevel),
        horizonTime: Number(e.horizonTime),
      };
      if (e.benchMark) {
        data.benchMark = e.benchMark;
      }
      this.setState({
        formData: data,
        isShow: true,
      });
    } else {
      message.warning('请填写完整的查询条件');
    }
  };

  // 组合改变将code放入state
  changePortfolio = (e) => {
    if (e !== undefined) {
      const data = e.info;
      if (data) {
        this.setState({
          portfolioCode: data.portfolioCode,
        });
      }
    }
  };
  getChildrenMsg = (result, msg) => {
    this.setState({
      childrenMsg: msg,
    });
  };
  render() {
    const { formData, isShow } = this.state;
    const defaultDays = moment().format('YYYY-MM-DD');
    const confidence = [
      { title: '95%', value: '0.95' },
      { title: '97.5%', value: '0.975' },
      { title: '99%', value: '0.99' },
    ];
    const horizon = [
      { title: '1D', value: '1' },
      { title: '10D', value: '10' },
    ];
    const searchProps = {
      dataSource: [
        {
          dataIndex: 'portfolio',
          title: '组合名称',
          type: DATA_ENTRY.PRODUCTGROUPTREE,
          multiple: false,
          onChange: (e) => this.changePortfolio(e),
        },
        {
          dataIndex: 'benchMark',
          title: '基准',
          type: DATA_ENTRY.BENCHMARK,
          allowClear: true,
        },
        {
          dataIndex: 'endDate',
          title: '截止日期',
          type: DATA_ENTRY.SINGLEDATE,
          disableEnd: moment(defaultDays),
          initialValue: moment().subtract(1, 'days'),
          // initialValue:moment(),
        },
        {
          dataIndex: 'confidenceLevel',
          title: '置信度',
          type: DATA_ENTRY.SELECT,
          allowClear: false,
          dataSource: confidence,
          initialValue: '0.95',
        },
        {
          dataIndex: 'horizonTime',
          title: '时间展望期',
          type: DATA_ENTRY.SELECT,
          allowClear: false,
          dataSource: horizon,
          initialValue: '1',
        },
      ],
      onQuery: (e) => this.searchData(e),
      onClear: () => {
        const { form } = this.props;

        form.resetFields();
      },
    };
    return (
      <ContentPackage
        title='VaR分析'
        contentHtml={
          <div className={style.body_area}>
            <div>
              <AdvancedSearch {...searchProps} />
            </div>
            {isShow ? (
              <div>
                <div style={{ textAlign: 'right', paddingRight: '20px' }}>最新数据日期：{this.state.childrenMsg}</div>
                <div style={{ marginTop: '20px' }}>
                  <Row gutter={16}>
                    <Col span={12}>
                      <GainsAndLosses formData={formData} demo={this} />
                    </Col>
                    <Col span={12}>
                      <ResultCharts formData={formData} />
                    </Col>
                  </Row>
                  <Row>
                    <Detailed formData={formData} />
                  </Row>
                </div>
              </div>
            ) : (
              <div style={{ marginTop: '10px' }}>
                <NoQueryC />
              </div>
            )}
          </div>
        }
      />
    );
  }
}
export default LiquidityRisk;
